<template>
	<view>
		<uni-collapse accordion @change="change">
			
			<uni-collapse-item    v-for="item in qudata" :key="item.id+''" :title="item.name">
				<view @click="selettitem(inneritem)" class="item-wrap collapse-wrap" v-for="inneritem in addressdata" :key="inneritem.id">
					<view class="left">
						<view class="pic">
							<image style="border-radius:14rpx" :src="inneritem.img" mode=""></image>
						</view>
						<view class="desc">
							<view class="title">{{inneritem.name}}</view>
							<view>电话：{{inneritem.phone}}</view>
							<view>地址：{{inneritem.address}}</view>
							
						</view>
					</view>
					<!-- <view class="right">
						<view class="btn" @click="selettitem(inneritem)">
							选择
						</view>
					</view> -->
				</view>
				
			</uni-collapse-item>
		</uni-collapse>
	</view>
</template>


<script>
	import { mapMutations } from 'vuex'
	export default {
		
		data() {
			return {
				
				qudata:[],
				addressdata:[]
			}
		},
		onLoad(options){
			this.loaddata(options.shiid)
			
			
		},
		methods: {
			selettitem(item){
				
				this.setzitidian(item)
				uni.navigateBack({
					delta: 2
				});
			},
			...mapMutations(['setzitidian']),
			change(e) {
				
				if(!(e+'')){
					return
				}
				this.addressdata=[]
				let that=this
				that.apiget('/api/home/get_pick_up_list',{
					area_id:that.qudata[e].id
				},true).then(res => {
					if(res.Code==10200){
						
						that.addressdata=res.Data
						
					}
					
				}).catch(err=>{
					console.log(err)
				});
				
			},
			loaddata(parent_id){
				
				let that=this
				that.apiget('/api/home/get_area',{
					parent_id
				},true).then(res => {
					if(res.Code==10200){
						let data=res.Data
						if(data.length==0){
							uni.showToast({
								title: '未查到自提点'
							})
						}
						that.qudata=data
						
						
					}
					
				}).catch(err=>{
					console.log(err)
				});
				
				
				
			}
		}
	}
</script>

<style>
	.desc{
		font-size:30rpx;
	}
	.btn{
		position:absolute;
		background:#f9436b;
		color:#fff;
		border-radius: 12rpx;
		padding:3rpx 5rpx;
		bottom:20rpx;
	}
	.collapse-wrap{
		background:#f8f8f8;
		padding:30rpx 20rpx 10rpx 20rpx;
	}
	.pic{
		width:140rpx;
		height:140rpx;
		
		margin-right:15rpx;
	}
	.item-wrap{
		display:flex;
		justify-content: space-between;
		
	}
	.item-wrap .left{
		padding:20rpx 0 20rpx 30rpx;
		background:#fff;
		border-radius:14rpx;
		display:flex;
		flex:1;
		align-items: center;
	}
	/* .item-wrap .right{
		position:relative;
		background:#fff;
		padding-right:20rpx;
		width:70rpx;
		display:flex;
		justify-content: space-between;
	} */
</style>